<template>
	<view class="content">
		<view class="content_con">
			<view class="content_c">
				<lPainter :board="base" :isRenderImage="true" @success="save" />
				<!-- <image mode="aspectFill" :src="path" ></image>. -->
			</view>
			<view @click="saveImage" class="btnsave">保存</view>
		</view>
	</view>
</template>

<script>
import lPainter from '@/components/lime-painter/';
export default {
	components: { lPainter },
	data() {
		return {
			path: '',
			base: {
				width: '750rpx',
				height: '1300rpx',
				background: '#fff',
				views: [
					{
						type: 'image',
						src: '',
						mode: 'aspectFill',
						css: {
							width: '750rpx',
							height: '724px',
						},
					},

					{
						type: 'image',
						src: '',
						mode: 'widthFix',
						css: {
							left: '245rpx',
							top: '540rpx',
							width: '260rpx',
							height: '260rpx',
						},
					},
				],
			},
		};
	},
	onLoad(e) {
		var shareInfo = uni.getStorageSync('shareInfo');
		this.base.views[0].src = shareInfo.user_poster_bg;
		this.get();
	},
	methods: {
		async get() {
			this.$api('geterweima', {
				shopid: 1,
			}).then(res => {
				console.log('res 得到图片地址 :>> ', res.data);
				this.base.views[1].src = res.data;
			});
		},
		save(path) {
			this.path = path;
		},
		saveImage() {
			this.isShowPopup = false;
			uni.saveImageToPhotosAlbum({
				filePath: this.path,
				success(res) {
					uni.showToast({
						title: '已保存到相册',
						icon: 'success',
						duration: 2000,
					});
				},
			});
			uni.previewImage({
				urls: [this.path],
				longPressActions: {
					itemList: ['发送给朋友', '保存图片', '收藏'],
					success: function(data) {
						console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
					},
					fail: function(err) {
						console.log(err.errMsg);
					},
				},
			});
		},
	},
};
</script>

<style lang="scss" scoped>
.content {
	// position: fixed;
	// left: 0;
	// top: 0;
	width: 100vw;
	height: 100vh;
	// overflow: hidden;
	.content_con {
		width: 100%;
		height: 100%;
		background: #fff;
		.content_c {
			height: 100vh;
			width: 100vw;
			// position: absolute;
			// top: 0;
			// left: 0;
			// right: 0;
			// margin: auto;
			// bottom: 0;
			// image {
			// 	width: 100%;
			// 	height: 100%;
			// }
		}
		.btnsave {
			position: fixed;
			right: 0;
			bottom: 50rpx;
			z-index: 99999999999;
			width: 100%;
			height: 80rpx;
			background: rgba(6, 170, 110, 0.7);
			color: #fff;
			font-size: 28rpx;
			line-height: 80rpx;
			text-align: center;
		}
	}
}
</style>
